﻿@{
    ViewData["Title"] = "程序环境列表";
    Layout = "~/Views/Shared/_Layout.cshtml"; 
}

<div id="appEnv" style="margin:2px;padding:2px;">
    <el-form   class="query-form">
        <el-form-item>
            <el-button type="success" size="small" @@click="editEnv (null)" v-show="pageButtons.includes('addenv')">新增</el-button>
            <el-button type="primary" size="small" @@click="GetEnvList()">查询</el-button>
        </el-form-item>
    </el-form>
    <el-table :data="tableData" stripe border :style="tableStyle" size="mini">
        <el-table-column type="index" width="50" align="center"></el-table-column>
        <el-table-column prop="envCode" label="环境编码" width="180"></el-table-column>
        <el-table-column prop="envName" label="环境名称" width="180"></el-table-column>
        <el-table-column prop="orderIndex" label="排序" width="100" align="center"></el-table-column>
        <el-table-column prop="remark" label="备注" width="300"></el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="200" align="center">
        </el-table-column>
        <el-table-column prop="updateTime" label="修改时间" width="200" align="center">
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="250" align="center"> 
            <template slot-scope="scope" >
                <el-button type="success" size="mini" @@click="setSecret(scope.row)" v-show="pageButtons.includes('set_project_envsecret')">密钥设置</el-button>
                <el-button type="primary" v-if="scope.row.isAllowDeleted" size="mini" @@click="editEnv(scope.row)" v-show="pageButtons.includes('editenv')">修改</el-button>
                <el-button type="danger" v-if="scope.row.isAllowDeleted" size="mini" @@click="deleteEnv(scope.row)" v-show="pageButtons.includes('delenv')">删除</el-button>
            </template>
        </el-table-column>
    </el-table>
</div>


<style>
    .el-table .warning-row {
        background: oldlace;
    }

    .el-table .success-row {
        background: #f0f9eb;
    }
</style>
<script>
    function refreshFromChild() {
        vueEnv.GetEnvList();
    }

    var vueEnv = new Vue({
        el: '#appEnv',
        data() {
            return {
                pageButtons: [],

                EnvName: '',
                enableStatus: 0,
                enabled: null,
                pageSize: 10,
                currentPage: 1,
                total: 0, 

                tableStyle: getTableStyle(),
                tableData: []
            }
        },
        created(){
          var _this = this;
            _this.GetEnvList();
            window.addEventListener("resize", function () {
                _this.tableStyle = getTableStyle(); 
            });

            _this.$getMenuButtons();
        },
        methods: {
            editEnv(row) {
                var id = 0;
                if(row) id=row.id;
                this.$addTab(id, id==0?"新增环境": "修改环境","../environment/edit?id="+id );
            },
            setSecret: function (row) {
                this.$addTab(row.id, "["+row.envName+"]密钥设置", "../environment/secret?envId=" + row.id);
            },
            deleteEnv(row) {
                var _this = this;
                  axios.post("@Url.Action("DelEnvironment", "environment")", {
                      envId: row.id
                  }).then((res) => {
                      _this.$success(res.message, function () {
                          if(res.success)
                             _this.GetEnvList();
                      });


                  }).catch((error) => {
                  });
            },
            tableRowClassName({ row, rowIndex }) {
                if (rowIndex === 1) {
                    return 'warning-row';
                } else if (rowIndex === 3) {
                    return 'success-row';
                }
                return '';
            }, 
            GetEnvList() {
                  var _this = this;
                 _this.$get("@Url.Action("GetEnvironmentList", "environment")", {  }).then((response) => {
                     _this.tableData = response;
                  }).catch((error) => {
                  });
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.GetEnvList();
            },
            handleCurrentChange(val) {
                this.currentPage = val;
                this.GetEnvList();
            }
        }
    });
</script>

